<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>order_1</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<script src="../js/public.js" type="text/javascript" charset="utf-8"></script>
		<style>
		   body{padding-bottom: 4.8rem;}
		   dd{margin: 0;}
		   .mui-bar-nav {
			    background-color: #71BB98;
			}
			.mui-title{color:#fff;font-size:1.2rem;}
		   .mui-content-padded{margin-top: 1rem;}
			h5 {
				margin-top: 30px;
				font-weight: bold;
			}
			h5:first-child {
				margin-top: 15px;
			}
			.fl{
				float: left;
			}
			.fr{
				float: right;
			}
			.chart_bot{
				background: #fff;
				padding:1rem;
				padding-top:0.5rem;
				width:100%;
			}
			
			.chart_bot h2{
				font-size: 1.1rem;
				font-weight: 500;
				color:#F47D00;
				border-left:5px solid #5b72f4;
				padding-left: 0.5rem;
				line-height: 1.5rem;
			}
			
			.mui-media-body{line-height: 42px;}
			.mui-table-view{background: transparent;}
			.mui-table-view-cell{padding:0;margin:-10px 0;}
			.mui-table-view:before{height: 0;}
			.mui-table-view:after{height: 0;}
			.phot{height: 8rem;}
			.phot img{display: block;margin:0 auto;width: 9rem;}
			.orderto{text-align: center;margin-top: 2rem;}
			.orderto a{width: 15%;}
			.abnormal{height: 2rem;}
			.abnormal label{width: 20%;text-align: right;line-height: 1.9; margin-top:0.1rem;}
			.abnormal input{width: 60%;border:0;background: transparent;height: 1.5rem;margin-bottom: 0;}
			.button{padding: 0 1rem;margin-top: 2rem;}
			.button a{width: 13%;}
			.mui-bar-tab .mui-tab-item {
			    background: #71bb9a;
			    color: #fff;
			}
			.mui-bar-tab .mui-tab-item.mui-active {
			    color: red;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">接单</h1>
		</header>
		<div class="mui-content">
			<div class="mui-content-padded">
				<div class="fl chart_bot" style="background: transparent;border:2px dashed rgb(0,153,255);border-radius: 8px;">
					<h2 style="border-left: 0;">工单信息</h2>
					<hr style="margin-bottom: 1rem;" />
					<div class="abnormal">
						<label for="" class="fl">工单编号：</label>
						<input type="text" class="fl" id="order_num" readonly="readonly" value="SDJSL521489" />
						<div class="mui-clearfix"></div>
					</div>
					<div class="abnormal">
						<label for="" class="fl">生成时间：</label>
						<input type="text" class="fl" id="order_time" readonly="readonly" value="2017-8-29  14:25" />
						<div class="mui-clearfix"></div>
					</div>
					
				</div>
				<div class="mui-clearfix"></div>
			</div>
			<div class="mui-content-padded">
				<div class="chart_bot">
					<h2>异常信息</h2>
					<hr style="margin-bottom: 1rem;" />
					<div class="abnormal">
						<label for="" class="fl">异常时间：</label>
						<input type="text" class="fl" id="createtime" readonly="readonly" value="2017-8-28 " />
						<div class="mui-clearfix"></div>
					</div>
					<div class="abnormal">
						<label for="" class="fl">异常地点：</label>
						<input type="text" class="fl" id="abnormal_area" readonly="readonly" value="天辰路与舜华路交叉口路北" />
						<div class="mui-clearfix"></div>
					</div>
				</div>
				
			</div>
			<div class="mui-content-padded">
				<div class="fl chart_bot">
					<h2>照片</h2>
					<hr style="margin-bottom: 1rem;" />
					<div class="phot showimg">
						 <img src="../img/u62.png" id="start"/>
					</div>
					
				</div>
				<div class="mui-clearfix"></div>
			</div>
			<div class="mui-content-padded">
				<div class="fl chart_bot">
					<h2>是否接单</h2>
					<hr style="margin-bottom: 1rem;" />
					<div class="orderto">
						<a href="javascript:void(0);" class="mui-btn mui-btn-primary" id="send">接单</a>
						<a href="javascript:void(0);" id="deta" class="mui-btn mui-btn-primary">退单</a>
					</div>
					
				</div>
				<div class="mui-clearfix"></div>
			</div>
		</div>
		<nav class="mui-bar mui-bar-tab">
	    <a class="mui-tab-item mui-active" style="border-right: 2px solid #fff;" id="home">
	        <span class="mui-icon mui-icon-home"></span>
	        <!--<span class="mui-tab-label">首页</span>-->
	    </a>
	    <a class="mui-tab-item" href="" id="myinfo">
	        <span class="mui-icon mui-icon-person"></span>
	        <!--<span class="mui-tab-label">电话</span>-->
	    </a>
	</nav>
	<script type="text/javascript">
		//
		document.getElementById('myinfo').addEventListener('tap',function(){
			mui.openWindow({
					url:"per_information.html",
					id:"per_information",
					style:{},
					show:{
						autoShow:true,
						aniShow:"slide-in-right",
						duration:100
					},
					waiting:{
						autoShow:true,
						title:"正在加载·····",
						options:{
						}
					}
			})
		});
		//
		document.getElementById('home').addEventListener('tap',function(){
			mui.openWindow({
					url:"../main.html",
					id:"main",
					style:{},
					show:{
						autoShow:true,
						aniShow:"slide-in-right",
						duration:100
					},
					waiting:{
						autoShow:true,
						title:"正在加载·····",
						options:{
						}
					}
			})
		});
	</script>
		<script src="../js/mui.min.js"></script>
		
	</body>
    <script>
		(function($, doc) {
			$.init();
			var user = JSON.parse(localStorage.getItem('$users')).account;
//			var settings = app.getSettings();
			$.plusReady(function() {
				var cw = plus.webview.currentWebview();
				var name=cw.name;
				var order_num=cw.order_num;
				
				var order_area=cw.order_area;
				var order_time=cw.order_time;
				var order_id=cw.order_id;
				var order_pic=cw.order_pic;
				var abnormal_name=cw.abnormal_name;
				var createtime=cw.createtime;
				doc.getElementById('order_num').value=order_num;
				doc.getElementById('order_time').value=order_time;
				doc.getElementById('createtime').value=createtime;
				doc.getElementById('abnormal_area').value=order_area;
				doc.getElementById('start').src=order_pic;
				//
			    var send = document.getElementById('send');
				send.addEventListener('tap',function(){
					var btnArray = ['否', '是'];
	                mui.confirm('确认要接单吗？', '系统提示', btnArray, function(e) {
	                    if (e.index == 1) {
	                          $.openWindow({
								url:"work_1.html",
								id:"work_1",
								extras:{
	                              order_id:order_id
							   },
								show: {
									aniShow: 'pop-in'
								},
								styles: {
									popGesture: 'hide'
								},
								waiting: {
									autoShow: false
								}
							});
	                    } 
	                })
					
				});
			
			    //
			    //转派
                $('.orderto').on('tap','#deta',function(){
                	var btnArray = ['否', '是'];
	                mui.confirm('确认要退单吗？', '系统提示', btnArray, function(e) {
	                    if (e.index == 1) {
                            $.ajax({
					            type: "POST",
							    url: __PATH__+"index/order_1",
							    async: true,
							    data:{
							    	user:user,
							    	order_id:order_id
							    },
							    dataType: "json",
							    json: "jsoncallback",
							    timeout: 1000,
							    success: function(data) {
							    	console.log(data);
							    	if(data.code==200){
                 					    	$.openWindow({
												url:"../main.html",
												id:"main",
												show: {
													aniShow: 'pop-in'
												},
												styles: {
													popGesture: 'hide'
												},
												waiting: {
													autoShow: false
												}
											});
							    	}
		
							    },
							    error:function(xhr,type,errorThrown){
									mui.alert(xhr,'提示') 				
								}
							}); 
	                    } 
	                })
                	
                	//
                	
                });
				//
				
			});
			//
			
			
			
		}(mui, document));
	</script>
</html>